<template>
  <el-card>
    <template #header>
      <!-- 标题 -->
      <h2>{{papername}}答卷</h2>
    </template>
    <template v-if="answerSheet.length === 0">
      <h3>这个问卷没有作答</h3>
    </template>
    <template v-if="answerSheet.length">
    <template  v-for="(aSheet, index) in answerSheet">
    <el-card style="margin-bottom:10px" v-for="ol in aSheet.outlines" :key="ol._id+index">
      <template #header>
        <span>{{aSheet.outlines.indexOf(ol)+1}}.{{ol.outlinename}}</span>
      </template>

      <el-radio-group v-model="ol.answer">
        <el-radio :disabled="ol.answer !== item.itemname"  v-for="item in aSheet.items"
        :key="item._id+index" :label="item.itemname">
          {{item.itemname}}
        </el-radio>
      </el-radio-group>

    </el-card>
    <el-divider :key="index"></el-divider>
    </template>
    </template>
  </el-card>
</template>

<script>
export default {
  props: ['id', 'papername'],
  data() {
    return {
      answerSheet: [
        {
          outlines: [],
          items: [],
          _id: [],
        },
      ],
      res: {},
    };
  },
  async created() {
    const { data: { result } } = await this.apis.getAnswers(this.id);
    this.answerSheet = result;
  },
};
</script>
